<template>
  <div>
    <headerc :title="title"></headerc>
    <div class="c-main-show">
      <div class="main-seting">
        <div>
          <div class="title-text">巡检记录列表</div>
          <div style="margin: 20px">
            <el-table
              :data="tableData"
              border
              style="width: 100%"
              :header-cell-style="{ background: '#F6F7FB' }"
            >
              <el-table-column prop="recordType" label="巡检类型">
              </el-table-column>
              <el-table-column label="最新数据更新时间">
                <template slot-scope="scope">
                  <span>{{ timefun(scope.row.inspectionTime) }}</span>
                </template>
              </el-table-column>
              <el-table-column
                prop="empRels"
                label="最新巡检人"
                :show-overflow-tooltip="true"
              >
                <template slot-scope="scope">
                  <span
                    style="
                      width: 100px;
                      overflow: hidden;
                      text-overflow: ellipsis;
                      white-space: nowrap;
                    "
                    >{{ scope.row.empRels }}</span
                  >
                </template>
              </el-table-column>
              <el-table-column label="是否存在异常">
                <template slot-scope="scope">
                  <span>{{ scope.row.leaderDeal ? '是' : '否' }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="num" label="查看详情">
                <template slot-scope="scope">
                  <el-button
                    @click="handleClick(scope.row)"
                    type="text"
                    size="small"
                    >查看</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
          </div>
          <div class="fenye">
            <el-pagination
              background
              layout="prev, pager, next"
              :page-size="pageSize"
              :total="total"
              :hide-on-single-page="total < 10"
              @current-change="currentChange"
              style="margin-left: 25%"
            >
            </el-pagination>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import headerc from '@/components/header.vue'
import utils from '@/utils/utils'
import { pdroomgetRecordTypeDict } from '../../api/patrol-record'
export default {
  components: {
    headerc
  },
  data() {
    return {
      uid: '',
      updata: 1,
      pageNo: 1,
      pageSize: 10,
      total: 0,
      currentPage1: 5,
      currentPage2: 5,
      currentPage3: 5,
      currentPage4: 4,
      title: '巡检记录列表',
      form: '',
      value1: '',
      formInline: {
        user: '',
        region: '',
        value1: '',
        mingcheng: ''
      },
      tableData: [],
      dialogVisible: false,
      dialogVisible2: false
    }
  },
  created() {
    pdroomgetRecordTypeDict().then((res) => {
      console.log(res.data)
      this.tableData = res.data
    })
  },
  methods: {
    timefun(data) {
      return utils.formatDate(data, 'yyyy-MM-dd HH:mm:ss')
    },
    handleClick(val) {
      if (val.recordType === '10KV变压器') {
        this.$router.push('/patrol/kvtransformer')
      } else if (val.recordType === '10KV操作室') {
        this.$router.push('/patrol/kvoperation')
      } else if (val.recordType === '10KV干式变压器') {
        this.$router.push('/patrol/drytransformer')
      } else if (val.recordType === '主变') {
        this.$router.push('/patrol/maintransformer')
      } else if (val.recordType === '低压配电室') {
        this.$router.push('/patrol/lowroom')
      } else if (val.recordType === '仪表机柜间') {
        this.$router.push('/patrol/meterroom')
      } else if (val.recordType === '智能机器人班机柜') {
        this.$router.push('/patrol/robotroom')
      } else if (val.recordType === 'SF6气体密度继电器') {
        this.$router.push('/patrol/sf6machine')
      }
    },
    currentChange(pageNo) {
      this.pageNo = pageNo
    },
    handleSizeChange() {},
    handleCurrentChange() {}
  }
}
</script>

<style lang="scss" scoped>
.c-main-make {
  height: 200px;
  background: #fff;
  margin-bottom: 35px;
  position: relative;
  overflow: hidden;
  border: 1px #dcdee0 solid;
}
.c-main-show {
  background: #fff;
  margin-bottom: 35px;
  position: relative;
  overflow: hidden;
  border: 1px #dcdee0 solid;
}
.title-text {
  width: 100%;
  height: 50px;
  border-bottom: 1px #dcdee0 solid;
  font-family: '微软雅黑 Bold', '微软雅黑 Regular', 微软雅黑, sans-serif;
  font-weight: 700;
  color: #666666;
  line-height: 50px;
  padding-left: 25px;
}
.fenye {
  display: flex;
  justify-content: right;
}
</style>
